<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('新增会员管理')"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-member-add">
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">电话：</label>
            <div class="col-sm-5">
                <input name="phone" class="form-control" type="text" data-mask="999-9999-9999"
                       placeholder="请输入手机号码" required>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">姓名：</label>
            <div class="col-sm-5">
                <input name="name" class="form-control" maxlength="10" type="text" placeholder="请输入姓名" required>
            </div>
        </div>
        <!--后端根据充值金额判断等级-->
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">充值金额：</label>
            <div class="col-sm-5">
<!--                <div class="input-group m-b"><span class="input-group-addon">&yen;</span>-->
<!--                    <input type="number" name="balance" class="form-control" required> <span class="input-group-addon">.00</span>-->
<!--                </div>-->
                <select class="form-control" name="balance"   id="balance" required>
<!--                    会员充卡1000元10次，2000元22次 -->
                    <option value="">--请选择充值金额--</option>
                    <option value="1000">1000元(10次)</option>
                    <option value="2000">2000元(22次)</option>
                </select>

            </div>


        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label"></label>
            <div class="col-sm-5">
                <div class="input-group m-b">
                    <span class="help-block">
                        <i class="fa fa-info-circle"></i>
                            充值金额达到固定金额自动拥有相应次数
                        </span>
                </div>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label"></label>
            <div class="col-sm-5">
                <button type="button" class="btn btn-w-m btn-primary" onclick="submitAddMember()">提交</button>
            </div>
        </div>
    </form>

</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: jasny-bootstrap-js"/>
<script th:inline="javascript">
    var prefix = ctx + "custom/member"
    $("#form-member-add").validate({
        focusCleanup: true
    });

    function submitAddMember() {
        if ($.validate.form()) {
            $.modal.confirm("确认提交?", function () {
                // 打开遮罩层
                $.modal.loading("正在添加会员，请稍后...");
                $.operate.save(prefix + "/add", $('#form-member-add').serialize(), function (rs) {
                    // 关闭遮罩层
                    $.modal.closeLoading();
                    check(rs)
                })
            })
        }
    }

    // 弹出检查
    function check(rs) {
        if (rs.code === 500) {
            $.modal.msgError("系统错误!,请联系管理员");
        } else if (rs.code === 0) {
            $.modal.msgSuccess("添加成功!");
            // 关闭选项卡
            $.modal.closeTab();
        } else {
            $.modal.msgWarning(rs.message);
        }
    }


</script>
</body>
</html>